<template>
  <div>
   <h1>房型的增加</h1>
   <table class="table table-bordered">
    <tbody>
      <tr>
        <td>房间名称</td>
        <td>
          <input type="text" v-model="info.fjcname">
        </td>
      </tr>

      <tr>
        <td>门市价</td>
        <td>
          <input type="text" v-model="info.mensja">
        </td>
      </tr>


      <tr>
        <td>押金</td>
        <td>
          <input type="text" v-model="info.yjin">
        </td>
      </tr>


      <tr>
        <td>房型面积</td>
        <td>
          <input type="text" v-model="info.mianji">
        </td>
      </tr>


      <tr>
        <td>可住人数</td>
        <td>
          <input type="text" v-model="info.rshu">
        </td>
      </tr>

      <tr>
        <td>是否加床</td>
        <td>
         <input type="radio" value="0" name="Zt" v-model="info.sfjiac">不可加床
         <input type="radio" value="1" name="Zt" v-model="info.sfjiac">免费加床
        </td>
      </tr>

      <tr>
        <td>图片</td>
        <td>
          <input type="file" @change="ToPian">
          <img :src="info.photo" width="50" height="50" alt="">
        </td>
      </tr>

      <tr>
        <td>备注</td>
        <td>
          <textarea v-model="info.fxBezhu"></textarea>
        </td>
      </tr>

      
      <tr>
        <td></td>
        <td>
          <input type="button" class="btn btn-success" value="增加" @click="Ok">
        </td>
      </tr>
    </tbody>
   </table>
  </div>
</template>

<script setup lang="ts">
import {ref,reactive,onMounted} from 'vue';
import axios from 'axios'
import { useRoute,useRouter } from 'vue-router';
let route=useRoute();
let router=useRouter()

const info=reactive({
  "id": 0,
  "fjcname": "",
  "mensja": "",
  "yjin": "",
  "mianji": "",
  "rshu": "",
  "sfjiac": 0,
  "photo": "",
  "fxBezhu": "",

})



const Ok=()=>{
if(info.fjcname=="")
{
  alert('房间名称不为空');
  return;
}

if(info.mensja=="")
{
  alert('门市价不为空');
  return;
}

if(info.yjin=="")
{
  alert('押金不为空');
  return;
}

if(info.mianji=="")
{
  alert('房型面积不为空');
  return;
}


if(info.rshu=="")
{
  alert('可住人数不为空');
  return;
}


if(info.photo=="")
{
  alert('图片不为空');
  return;
}


if(info.fxBezhu=="")
{
  alert('备注不为空');
  return;
}



axios.post("https://localhost:7177/api/Fx/AdtjFx",info).then(res=>{
  if(res.data>0)
   {
     alert("添加成功");
     router.push('/ShowFxView');
   }
   else{
    alert('添加失败');
    return;
   }
})
}

const ToPian=(e:any)=>{
  var fromdata=new FormData();
  var file=e.target.files[0];
  fromdata.append("file",file);
  axios.post("https://localhost:7177/api/Fx/pic",fromdata).then(res=>{
    info.photo=res.data
  })
}
</script>

<style scoped>

</style>